<html>
<head>
<title>CSS3 media query test: stylesheet media property enumeration.</title>
<link rel="help" href="http://www.w3.org/TR/css3-mediaqueries/#syntax" />
<link rel="help" href="http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html" />
<link rel="help" href="http://www.w3.org/TR/1998/REC-html40-19980424/types.html#h-6.13" />

<style type="text/css" media="braille, media with error, screen and (color) and (grid:0), tty resolution > 600px">
#result { color: green; }
</style>

<script language="javascript">
function test() {
    re = document.getElementById("result");
    re.innerHTML = "started";
    re.innerHTML = document.styleSheets[0].media.item(0)
                    + ", " + document.styleSheets[0].media.item(1)
                    + ", " + document.styleSheets[0].media.item(2)
                    + ", " + document.styleSheets[0].media.item(3) ;
}
</script>

</head>
<body onload="test()">
<p> The text below should be green and contain "braille, not all, screen and (color) and (grid: 0), not all". </p>
<p id="result">Failure: test not run</p>
</body>
</html>
